/** 
 * 学习目标:学习 props里children属性  
 * 
children属性：表示该组件的子节点，只要组件有子节点，props就有该属性

children 属性与普通的props一样，值可以是任意值（文本、React元素、组件，甚至是函数）
 * */
import React, { Component } from 'react';


export default class App extends React.Component {
    state = {
        msg: 'Hello React'
    }
    render() {
        // 使用Provider组件传数据，设置value属性，value的值即是传递的数据
        return (
            <div>
                {/* <Hello>123123</Hello> */}
                <Hello>{(msg) => <i>{msg}</i>}</Hello>
            </div>
        );
    }
}
// function Hello(props) {
//     return (
//         <div>
//             该组件的子节点：{props.children}
//         </div>
//     )
// }

export class Hello extends Component {
    state = {
        msg: 'hhhhh'
    }
    render() {
        return (
            <div>
                {this.props.children(this.state.msg)}
            </div>
        )
    }
}

